<!DOCTYPE html>
<html lang="en" style="transition: background-color 0.15s ease 0s;">
<head>
    {% load static %}
    <meta charset="UTF-8">
    <title>执行结果</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="{% static '/css/layui.css' %}">
</head>
<body>
<div class="layui-layout layui-layout-admin">
    <div class="layui-header header header-demo" style="background-color: #393D49">
        <div class="layui-main">
            <ul class="layui-nav">
                <button style="background-color: #393D49;margin-left: -20px;" type="button"
                        class="layui-btn layui-btn-normal"><i
                        class="layui-icon"></i></button>
                <li class="layui-nav-item"><a href="{%url 'TestPlatform_User:Home'%}"><h1>TestPlatform</h1></a></li>
                <li class="layui-nav-item">
                    <a href="{%url 'TestPlatform_User:Project_List'%}">项目列表</a>
                <li class="layui-nav-item">
                    <a href="{%url 'TestPlatform_User:Interface_List'%}">接口列表</a>
                </li>
                <li class="layui-nav-item">
                    <a href="{%url 'TestPlatform_User:Interface_Perform'%}">快速执行</a>
                </li>
                <li class="layui-nav-item"><a href="">测试报告</a></li>
                <li class="layui-nav-item"><a href="">邮件配置</a></li>
                <li class="layui-nav-item" style="float: right">
                    <a href="javascript:;">{{ user.get_username }}</a>
                    <dl class="layui-nav-child">
                        <dd><a href="{%url 'TestPlatform_User:Logout'%}"><i
                                class="layui-icon">&#xe64d; </i>登出</a></dd>
                    </dl>
                </li>
                <li style="margin:12px;float: right">
                    <div style="margin-left: 30px;">
                        <input type="hidden" name="color" value="" id="test-all-input">
                        <div id="test-all"></div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
    <!--<div style="margin-left: 200px;">-->
    <div style="padding: 20px; background-color: #F2F2F2;">
        <div class=" demoTable ">
            <button type="button" class="layui-btn layui-btn" data-type="getCheckData"
                    style="float: right; margin-right: 20px"><i class="layui-icon">&#xe663; </i>生成报告
            </button>
            <button type="button" class="layui-btn layui-btn" id="sendEmail" data-type="sendEmail"
                    style="float: right; margin-right: 20px"><i class="layui-icon">&#xe609;</i>发送邮件
            </button>
            <button type="button" class="layui-btn layui-btn" id="reprot" data-type="reprot" onclick="views()"
                    style="float: right; margin-right: 20px"><i class="layui-icon">&#xe609;</i>查看报告
            </button>
        </div>

        <!--</form>-->
        <div style="margin-top: 55px">
            <table class="layui-hide" id="table_data" lay-filter="table_data"></table>
        </div>
    </div>

    {% load static %}
    <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script>
    <script src="{% static '/js/layui.js' %}" charset="utf-8"></script>
    <script type="text/javascript">
        layui.use('element', function () {
            var element = layui.element; //导航的hover效果、二级菜单等功能，需要依赖element模块
            //监听导航点击
            element.on('nav(table_data)', function (elem) {
                //console.log(elem)
                layer.msg(elem.text());
            });
        });
        function views(){
            window.location.href='E:/TestPlatform_Cz/InterfaceTestPlatform/report/TestReport.html'
        }
        layui.use('table', function () {
            var table = layui.table;
        });

        layui.use(['layer', "jquery"], function () {
            var
                layer = layui.layer //弹层
                , $ = layui.jquery;
            $('#add_project').on("click", function () {
                layer.open({
                    title: '新增项目',
                    type: 2,
                    skin: 'layui-layer-rim', //加上边框
                    area: ['460px', '500px'], //宽高
                    fix: true,
                    // btn: ['确认提交', '取消'],
                    shadeClose: true,//点击旁边地方自动关闭
                    content: "../add_project",
                });

                // layer.close(layer.index);
            })
        });
        //----------------------------------------------------------------------
        layui.use('table', function () {
            var table = layui.table;
            table.render({
                elem: '#table_data'	//表单ID
                , url: "{%url 'Api:perform_data'%}"	//数据接口
                , page: true			//分页设置
                , limit: 20		//默认每一页显示数量
                , limits: [10, 20, 30, 40, 50]		//可选择每页显示的数量
                , toolbar: true
                , cols: [[			//表格列
                    {type: 'checkbox', sort: false}
                    , {field: 'in_id', title: 'ID', align: 'center', sort: true, edit: 'int'}
                    , {field: 'in_mname', title: '接口名称', sort: false, edit: 'text'}
                    , {field: 'in_type', title: '接口类型', align: 'center', sort: false, edit: 'text'}
                    , {field: 'in_url', title: '接口地址', sort: false, edit: 'text'}
                    , {field: 'in_data', title: '接口参数', sort: false, edit: 'text'}
                    , {field: 'in_data_type', title: '数据类型', align: 'center', sort: false, edit: 'text'}
                    , {field: 'in_tname', title: '测试人员', align: 'center', sort: false, edit: 'text'}
                    , {field: 'in_expected_result', title: '预期结果', align: 'center', sort: false, edit: 'text'}
                    , {field: 'in_actual_result', title: '实际结果', align: 'center', sort: false,}
                ]]
                , response: {
                    statusCode: 200
                }
                , id: 'testReload'
                , done: function (res, curr, count) {
                    var that = this.elem.next();
                    res.data.forEach(function (item, index) {
                        if (parseInt(item.in_actual_result) !== parseInt(item.in_expected_result)) {
                            var tr = that.find(".layui-table-box tbody tr[data-index='" + index + "']");
                            tr.css("background-color", "#FF5722");
                            tr.css("color", "white");
                        } else {
                            var tr = that.find(".layui-table-box tbody tr[data-index='" + index + "']");
                            tr.css("background-color", "#00FF40");
                            tr.css("color", "white");
                        }
                    });
                }
                , parseData: function (res) { //将原始数据解析成 table 组件所规定的数据，res为从url中get到的数据
                    var result;
                    if (this.page.curr) {
                        result = res.data.slice(this.limit * (this.page.curr - 1), this.limit * this.page.curr);
                    } else {
                        result = res.data.slice(0, this.limit);
                    }
                    return {
                        "code": res.code, //解析接口状态
                        "msg": res.msg, //解析提示文本
                        "count": res.count, //解析数据长度
                        "data": result //解析数据列表
                    };
                }
            });
            var $ = layui.$, active = {
                getCheckData: function () { //获取选中数据
                    var checkStatus = table.checkStatus('testReload')
                        , data = checkStatus.data;
                    var arr = JSON.stringify(data);
                    if (data.length === 0) {
                        layer.msg('请选择需要生成报告的数据！')
                    } else {
                        layer.confirm('是否将选中的' + data.length + '条数据生成报告', {
                            btn: ['生成', '取消'],
                        }, function (index) {
                            $.ajax({
                                type: 'post',
                                url: "{%url 'TestPlatform_User:Report'%}",
                                data: {'arr': arr},
                                traditional: true,
                                async: false,
                            });

                            layer.msg("已生成!", {
                                icon: 1,
                                time: 3000, //2秒关闭（如果不配置，默认是3秒）

                            }, function () {
                                //do something
                                layer.close(index);
                                // window.location.reload();
                            });
                        }, function (index) {
                            window.location.reload();
                            layer.close(index);
                        })

                    }
                }
            };
            layui.use(['layer', "jquery"], function () {
                var
                    layer = layui.layer //弹层
                    , $ = layui.jquery;
                $('#sendEmail').on("click", function () {
                    var index = layer.open({
                        title: '邮件配置',
                        type: 2,
                        skin: 'layui-layer-rim', //加上边框
                        area: ['450px', '510px'], //宽高
                        fix: true,
                        // btn: ['确认提交', '取消'],
                        shadeClose: true,//点击旁边地方自动关闭
                        content: "../SendEmail",
                    });
                })
                $('#reprot').on("click", function () {
                    window.location.href = 'E:/TestPlatform_Cz/InterfaceTestPlatform/report/TestReport.html';
                });
        });
        $('.demoTable .layui-btn').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });
        })
        ;

        layui.use('form', function () {
            var form = layui.form;
            //刷新界面 所有元素
            form.render();
            // 只刷新radio元素
            // form.render('radio');
        });
        layui.use('table', function () {
            var table = layui.table;
            //监听表格复选框选择
            table.on('checkbox(table_data)', function (obj) {
                console.log(obj)
            });
            //监听工具条 删除一条数据
            table.on('tool(table_data)', function (obj) {
                var data = obj.data;
                if (obj.event === 'del') {
                    layer.confirm('真的删除行么', function (index) {
                        $.ajax({
                            type: 'post',
                            url: "{%url 'TestPlatform_User:Delete_Pj'%}",
                            data: {'data_id': data.id},
                            traditional: true,
                            async: false,
                            success: function (result) {
                            },
                            error: function (result) {
                            }
                        });
                        obj.del();
                        layer.close(index);
                    });
                } else if (obj.event === 'add') {
                    $.ajax({
                        type: 'POST',
                        url: "{%url 'Api:project_data' %}",
                        data: {'data_id': data.id},
                        traditional: true,
                        async: false,
                        success: function (result) {
                        },
                        error: function (result) {
                        }
                    });
                    $.ajax({
                        type: 'POST',
                        url: "{%url 'TestPlatform_User:Project_Info'%}",
                        data: {'pj_name': data.pj_name},
                        traditional: true,
                        async: false
                    });
                    var storage = window.sessionStorage;
                    storage['id'] = data.id;
                } else if (obj.event === 'perform') {  //选中一条数据点击执行，使用sessionStorage存储数据

                }
            });
        });
    </script>
</body>
</html>